const React = require('react');
const {
  View,
  StyleSheet,
} = require('react-native');
const {
  JDDevice,
  JDDialog,
  JDScrollView,
  JDImage,
  JDText,
  JDRouter,
} = require('@areslabs/jdreact-core-lib');
const PageContainer = require('../../components/PageContainer');

/**
 * 此demo用于解决三星s8全面屏手机底部的三个按钮会消失导致返回的高度不正确，造成
 * 背景图片不能铺满整个屏幕
 */
class JDImageExample extends React.Component {
  state = {
      height:JDDevice.height,
  };

  render() {
    return (
      <PageContainer bodyStyle={styles.bodyPanel} title={this.props.title}>
        <View style={styles.bg} onLayout={(e)=>{
            var height = e.nativeEvent.layout.height;
            this.setState({
                height
            })

        }}>
            <JDImage
                source={require('./images/example1.jpg')}
                style={{
                    width: JDDevice.width,
                    height: this.state.height,
                    resizeMode: 'stretch',
                }}
            />
        </View>
      </PageContainer>
    );
  }
}

const styles = StyleSheet.create({
  bodyPanel: {
    padding: JDDevice.getRpx(20),
  },
  scrollView: {
    flex: 1,
  },
  bg:{
    position: 'absolute',
    top:0,
    left: 0,
    right: 0,
    bottom: 0,
  },
  
});

module.exports = JDImageExample;
